var typeLine=["pwd","name","sex","payment","priority"];
var typeAre=["educational","translation_experience","language_proficiency","introduction"];
var typeSelects=["city","language"];

//相应修改点击事件
function editorMessage() {
    $(this).unbind("click");
    var parent=$(this).parents(".introduce");
    var type=parent.attr("id");

    var node=parent.find(".introduce-container");
    //对原来的文本进行替换，先清空原有的\n再把空行填补回去
    var content=node.html().replace(new RegExp("\n","g"),"").replace(new RegExp("<br>","g"),"\n");

    var editNode;

    if($.inArray(type,typeLine)!==-1){
        editNode=$(textLine(type,node.attr("class")));
        editNode.find("input[name='msg']").val(content);

    } else if($.inArray(type,typeAre)!==-1){
        editNode=$(textAre(type,node.attr("class")));
        editNode.find("textarea").text(content);

    } else if($.inArray(type,typeSelects)!==-1) {
        editNode=selects(type, node ,node.attr("class"));
    }

    //绑定取消事件
    editNode.find(".glyphicon-remove").parent(".btn-default").click(cancelEdit);

    //绑定确认提交事件
    editNode.find(".glyphicon-ok").parent(".btn-default").click(submitEdit);

    node.after(editNode);
    node.hide();
}

//单行文本修改框
function textLine(type,className) {
    return "<div class='"+className+" introduce-edit'>\n" +
        "    <div class='row'>\n" +
        "        <form>\n" +
        "            <input name='name' value='"+type+"' hidden>\n" +
        "            <input name='msg' type='text' class='form-control'>\n" +
        "        </form>\n" +
        "    </div>\n" +
        "    <div class='row text-right'>\n" +
        "        <button class='btn btn-sm btn-default'>\n" +
        "            <span class='glyphicon glyphicon-ok'></span>\n" +
        "        </button>\n" +
        "        <button class='btn btn-sm btn-default'>\n" +
        "            <span class='glyphicon glyphicon-remove'></span>\n" +
        "        </button>\n" +
        "    </div>\n" +
        "</div>";
}

//多种选项型修框
function selects(type,node,className) {
    var editNode=$("<div class='"+className+" introduce-edit'>\n" +
        "    <div class='row'>\n" +
        "        <form>\n" +
        "            <input name='name' value='"+type+"' hidden>\n" +
        "            <select name='msg' class='form-control multiselect multiselect-primary' multiple='multiple'>\n" +
        "            </select>\n" +
        "        </form>\n" +
        "    </div>\n" +
        "    <div class='row text-right'>\n" +
        "        <button class='btn btn-sm btn-default'>\n" +
        "            <span class='glyphicon glyphicon-ok'></span>\n" +
        "        </button>\n" +
        "        <button class='btn btn-sm btn-default'>\n" +
        "            <span class='glyphicon glyphicon-remove'></span>\n" +
        "        </button>\n" +
        "    </div>\n" +
        "</div>");

    var url;

    if(type==="city"){
        url="/home/allCity";
    }else if(type==="language"){
        url="/home/allLanguage";
    }

    var options="";

    //生成选择列表
    $.ajaxSetup({async : false});
    $.get(url,function (data) {
        for(var i=0;i<data.length;i++){
            var option="<option value='"+data[i].id+"'>"+data[i].data+"</option>";
            editNode.find("select").append(option);
        }
    });

    //对翻译员已有的选项进行选择
    var span=node.find("span");
    span.each(function () {
        var id=$(this).attr("cid");
        editNode.find("option[value='"+id+"']").attr("selected",true);
    });

    editNode.find("select").select2({dropdownCssClass: 'dropdown-inverse'});

    return editNode;
}

//文本区域型修改框
function textAre(type,className) {
    return "<div class='"+className+" introduce-edit'>\n" +
        "    <div class='row'>\n" +
        "        <form>" +
        "            <input name='name' value='"+type+"' hidden>\n" +
        "            <textarea name='msg' class='form-control' rows='10'></textarea>\n" +
        "        </form>\n" +
        "    </div>\n" +
        "    <div class='row text-right'>\n" +
        "        <button class='btn btn-sm btn-default'>\n" +
        "            <span class='glyphicon glyphicon-ok'></span>\n" +
        "        </button>\n" +
        "        <button class='btn btn-sm btn-default'>\n" +
        "            <span class='glyphicon glyphicon-remove'></span>\n" +
        "        </button>\n" +
        "    </div>\n" +
        "</div>";
}

//获取并清空某个节点下的内容
function getContent(parent) {
    var text=parent.text();
    parent.empty();
    return text;
}

//取消修改
function cancelEdit() {
    var parent=$(this).parents(".introduce-edit");
    var node=parent.prev();
    parent.prev().show();
    parent.remove();

    //重新绑定修改事件
    node.parents(".introduce").find(".btn-default").click(editorMessage);
}

//提交修改
function submitEdit() {
    var parent=$(this).parents(".introduce-edit");
    var formdata=parent.find("form");

    var msg=formdata.find("*[name='msg']").val();
    var name=formdata.find("*[name='name']").val();
    //如果msg为select，则进行把msg写成数组
    if(parent.find("select").length!=0){
        msg=parent.find("select").val();
        msg=JSON.stringify(msg);
    }


    var json={"id":getQueryString("id"),"name":name,"msg":msg};

    $.get("/personage/updataMessage",json,function (data) {
        if(data.code==0){
            alert(data.msg);
        }else {
            location.reload();
        }
    });
}